import { mergeOptions } from "../utils/index"

export function initGlobApi(Vue) {
    // Vue.options = {created:[],watch:[]}
    Vue.options = {}
    Vue.mixin = function (mixin) {
        // 对象的合并
        this.options =  mergeOptions(this.options,mixin)
        // console.log(Vue.$options,'222222');
    }
    // 组件
    Vue.options.components = {}
    // 定义一个全局方法
    Vue.component = function (id,componentDef) {
        /**
         *  Vue.component("id", {
                template: `<button>全局按钮</button>`,
            });
             Vue.component({
                name:'name'
                template: `<button>全局按钮</button>`,
            });
         */
        // 这个name就相当于组件的名称
        componentDef.name = componentDef.name || id
        componentDef = this.extend(componentDef)
        this.options.components[id] = componentDef
        // console.log(this.options);
    }
    Vue.extend = function (options) {
        let spuer = this
        const Sub = function vuecomponent(opts) {
            console.log(this);
            this._init(opts)
        }
        // 子组件继承父组件中的属性
        Sub.prototype = Object.create(spuer.prototype)
        // 再修改Sub的原型的构造器的指向,指向原本
        Sub.prototype.constructor = Sub
        // 将父组件中的属性合并到子组件中
        Sub.options = mergeOptions(this.options,options)
        return Sub
    }
}